<template>
  <component :is="currentComponent" />
</template>

<script setup lang="ts">
import { computed } from 'vue'
import { useDevice } from '@/composables/useDevice'
import Foods from './Foods.vue'
import FoodsMobile from './FoodsMobile.vue'

const { isMobile } = useDevice()

const currentComponent = computed(() => {
  return isMobile.value ? FoodsMobile : Foods
})
</script>
